/**
* @file  Dev
* @author xiao_xie
* @date 2025-03-14
*/


import { Typography } from 'antd';
import classNames from 'classnames';

const { Title } = Typography;

export enum TitlePosition {
    left = 'left',
    center = 'center',
    right = 'right',
}

type Props = {
    level?: 1 | 5 | 2 | 3 | 4 | undefined; // 标题级别
    text?: string; // 标题文本
    id: number; // 组件的id
    position?: TitlePosition // 标题位置
    underline?: boolean; // 是否显示下划线
    markers?: boolean; // 是否显示标记
}

const Dev = ({ id, level = 1, text = '', position, underline, markers }: Props) => {

    const cls = classNames(['text-xl', 'font-bold', 'text-gray-500', {
        'text-left': position === TitlePosition.left,
        'text-center': position === TitlePosition.center,
        'text-right': position === TitlePosition.right,
        'underline': underline,
        'bg-[#F5FA09]': markers,
    }])

    return <Title data-component-id={id} level={level} className={cls}> {text}</Title>;
};
export default Dev;
